import { Game } from '../engine/core/Game';
import { RectangleCollider } from '../engine/physics/RectangleCollider';
import { CircleCollider } from '../engine/physics/CircleCollider';
import { PolygonCollider } from '../engine/physics/PolygonCollider';
import { Vector2 } from '../engine/physics/Vector2';
import { CollisionEventType } from '../engine/physics/types';

// 创建游戏实例
const game = new Game({
    canvas: document.getElementById('gameCanvas') as HTMLCanvasElement,
    width: 800,
    height: 600,
    backgroundColor: '#f0f0f0'
});

// 创建一些碰撞体
const rectangle = new RectangleCollider({
    width: 100,
    height: 50,
    position: new Vector2(400, 300),
    tag: 'player'
});

const circle = new CircleCollider({
    radius: 30,
    position: new Vector2(200, 200),
    tag: 'enemy'
});

const polygon = new PolygonCollider({
    vertices: [
        new Vector2(0, 0),
        new Vector2(50, 0),
        new Vector2(50, 50),
        new Vector2(0, 50)
    ],
    position: new Vector2(600, 400),
    tag: 'obstacle'
});

// 添加碰撞事件监听
rectangle.on(CollisionEventType.COLLISION_START, (event) => {
    console.log('Rectangle collision start:', event.colliderB.tag);
});

circle.on(CollisionEventType.COLLISION_STAY, (event) => {
    console.log('Circle collision stay:', event.colliderB.tag);
});

polygon.on(CollisionEventType.TRIGGER_START, (event) => {
    console.log('Polygon trigger start:', event.colliderB.tag);
});

// 添加碰撞体到管理器
game.collisionManager.addCollider(rectangle);
game.collisionManager.addCollider(circle);
game.collisionManager.addCollider(polygon);

// 添加鼠标控制
let isDragging = false;
let selectedCollider: any = null;

game.canvas.addEventListener('mousedown', (e) => {
    const rect = game.canvas.getBoundingClientRect();
    const mousePos = new Vector2(
        e.clientX - rect.left,
        e.clientY - rect.top
    );

    // 检查点击了哪个碰撞体
    if (rectangle.contains(mousePos)) {
        selectedCollider = rectangle;
        isDragging = true;
    } else if (circle.contains(mousePos)) {
        selectedCollider = circle;
        isDragging = true;
    } else if (polygon.contains(mousePos)) {
        selectedCollider = polygon;
        isDragging = true;
    }
});

game.canvas.addEventListener('mousemove', (e) => {
    if (isDragging && selectedCollider) {
        const rect = game.canvas.getBoundingClientRect();
        selectedCollider.position.set(
            e.clientX - rect.left,
            e.clientY - rect.top
        );
    }
});

game.canvas.addEventListener('mouseup', () => {
    isDragging = false;
    selectedCollider = null;
});

// 渲染函数
function render() {
    const ctx = game.ctx;
    ctx.clearRect(0, 0, game.width, game.height);

    // 绘制矩形
    ctx.fillStyle = rectangle.isTrigger ? 'rgba(255, 0, 0, 0.3)' : 'rgba(255, 0, 0, 0.5)';
    ctx.save();
    ctx.translate(rectangle.position.x, rectangle.position.y);
    ctx.rotate(rectangle.rotation);
    ctx.fillRect(-rectangle.width / 2, -rectangle.height / 2, rectangle.width, rectangle.height);
    ctx.restore();

    // 绘制圆形
    ctx.fillStyle = circle.isTrigger ? 'rgba(0, 255, 0, 0.3)' : 'rgba(0, 255, 0, 0.5)';
    ctx.beginPath();
    ctx.arc(circle.position.x, circle.position.y, circle.radius, 0, Math.PI * 2);
    ctx.fill();

    // 绘制多边形
    ctx.fillStyle = polygon.isTrigger ? 'rgba(0, 0, 255, 0.3)' : 'rgba(0, 0, 255, 0.5)';
    ctx.beginPath();
    const vertices = polygon.vertices.map(v => polygon.localToWorld(v));
    ctx.moveTo(vertices[0].x, vertices[0].y);
    for (let i = 1; i < vertices.length; i++) {
        ctx.lineTo(vertices[i].x, vertices[i].y);
    }
    ctx.closePath();
    ctx.fill();

    // 绘制碰撞体标签
    ctx.fillStyle = '#000';
    ctx.font = '14px Arial';
    ctx.textAlign = 'center';
    ctx.fillText(rectangle.tag, rectangle.position.x, rectangle.position.y - 30);
    ctx.fillText(circle.tag, circle.position.x, circle.position.y - 30);
    ctx.fillText(polygon.tag, polygon.position.x, polygon.position.y - 30);
}

// 更新函数
function update(deltaTime: number) {
    // 碰撞检测由 CollisionManager 自动处理
}

// 启动游戏
game.start(update, render); 